const path = require('path')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
// 图形化打包信息 上线删掉
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
module.exports = {
  // 部署应用包时的基本 URL,用法和 webpack 本身的 output.publicPath 一致
  publicPath: './',
  // 输出文件目录
  outputDir: 'dist_base',
  // eslint-loader 是否在保存的时候检查
  lintOnSave: false,
  // 是否使用包含运行时编译器的 Vue 构建版本
  runtimeCompiler: false,
  // 生产环境是否生成 sourceMap 文件
  productionSourceMap: false,
  // 生成的 HTML 中的 <link rel="stylesheet"> 和 <script> 标签上启用 Subresource Integrity (SRI)
  integrity: false,
  // webpack相关配置
  chainWebpack: (config) => {
    // 入口文件
    config.entry.app = ['babel-polyfill', './src/app.js']
    // element-ui自动就挂载在Vue上了，这里不需要写它，在入口文件main.js中也不用再vue.use了
    config.externals = {
      vue: 'Vue',
      vuex: 'vuex',
      'vue-router': 'VueRouter'
    }
    // 删除console插件
    const plugins = [
      new UglifyJsPlugin({
        uglifyOptions: {
          compress: {
            warnings: false,
            drop_console: true,
            drop_debugger: true
          },
          output: {
            // 去掉注释内容
            comments: true
          }
        },
        sourceMap: false,
        parallel: true
      })
    ]
    // 只有打包生产环境才需要将console删除
    if (process.env.VUE_APP_build_type == 'production') {
      config.plugins = [...config.plugins, ...plugins]
    }
    config.resolve.alias
      .set('vue$', 'vue/dist/vue.esm.js')
      .set('@', path.resolve(__dirname, './src'))
    // 开启图片压缩
    // config.module.rule('images')
    //   .test(/\.(png|jpe?g|gif)(\?.*)?$/)
    //   .use('image-webpack-loader')
    //   .loader('image-webpack-loader')
    //   .options({ bypassOnDebug: true })
    // //   // 使用图形化打包工具 上线删掉
    // // config.plugin('webpack-bundle-analyzer').use(BundleAnalyzerPlugin)
    // // 移除prefetch插件，避免加载多余的资源
    // config.plugins.delete('prefetch')
    // // 移除 preload 插件，避免加载多余的资源
    // config.plugins.delete('preload')
  },
  configureWebpack: (config) => {
    if (process.env.NODE_ENV === 'production') {
      // 生产环境
      config.mode = 'production'
      /* // 打包文件大小配置
      config.performance = {
        maxEntrypointSize: 10000000,
        maxAssetSize: 30000000
      } */
    } else {
      // 开发环境
      config.mode = 'development'
    }
  },
  // css相关配置
  css: {
    // 是否分离css（插件ExtractTextPlugin）
    extract: true,
    // 是否开启 CSS source maps
    sourceMap: false,
    // css预设器配置项
    loaderOptions: {},
    // 是否启用 CSS modules for all css / pre-processor files.
    modules: false
  },
  // 是否使用 thread-loader
  parallel: require('os').cpus().length > 1,
  // PWA 插件相关配置
  pwa: {},
  // webpack-dev-server 相关配置
  devServer: {
    open: true,
    host: 'localhost',
    port: 8001,
    https: false,
    hotOnly: false,
    // http 代理配置
    before: (app) => { },
    // proxy: {
    //   '/api': {
    //     target: 'http://localhost:8089', // 要代理的目标地址
    //     changeOrigin: true, // 是否跨域
    //     // localhost:8888/api/user => 触发代理 =>
    //     //  http://www.baidu.com/user  想要这种
    //     //  http://www.baidu.com/api/user  下面是目前的
    //     // pathRewrite: {
    //     '^/api': '' // 相当于将跨域代理之后的地址进行再次替换 就可以将 /api去掉
    //     // }
    //   }
    // }
  },
  // 第三方插件配置
  pluginOptions: {

  }
}
